﻿@{
    ViewBag.Title = "Home Page";
}

<div class="jumbotron">
    <h1>人事管理信息系统</h1>
    <p class="lead"></p>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="height:500px"></div>
    <!-- ECharts单文件引入 -->
    <script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: 'http://echarts.baidu.com/build/dist'
            }
        });

    // 使用
    require(
        [
            'echarts',
            'echarts/chart/pie',
            'echarts/chart/funnel'// 使用柱状图就加载bar模块，按需加载
        ],
            function (ec) {
                // 基于准备好的dom，初始化echarts图表
                var myChart = ec.init(document.getElementById('main'));

                var option = {
                    title: {
                        text: '人事管理系统用户访问来源',
                        subtext: '纯属虚构',
                        x: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: "{a} <br/>{b} : {c} ({d}%)"
                    },
                    legend: {
                        orient: 'vertical',
                        x: 'left',
                        data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
                    },
                    toolbox: {
                        show: true,
                        feature: {
                            mark: { show: true },
                            dataView: { show: true, readOnly: false },
                            magicType: {
                                show: true,
                                type: ['pie', 'funnel'],
                                option: {
                                    funnel: {
                                        x: '25%',
                                        width: '50%',
                                        funnelAlign: 'left',
                                        max: 1548
                                    }
                                }
                            },
                            restore: { show: true },
                            saveAsImage: { show: true }
                        }
                    },
                    calculable: true,
                    series: [
                        {
                            name: '访问来源',
                            type: 'pie',
                            radius: '55%',
                            center: ['50%', '60%'],
                            data: [
                                { value: 335, name: '直接访问' },
                                { value: 310, name: '邮件营销' },
                                { value: 234, name: '联盟广告' },
                                { value: 135, name: '视频广告' },
                                { value: 1548, name: '搜索引擎' }
                            ]
                        }
                    ]
                };



                // 为echarts对象加载数据
                myChart.setOption(option);
            }
        );
    </script>
    
</div>

<div class="row">
    <div class="col-md-4">
        <h2>员工档案</h2>
        <p>
            查看员工档案信息
        </p>
        <p><a class="btn btn-default" href="http://localhost:54250/EmployeeNews">点此查看 &raquo;</a></p>
    </div>
    <div class="col-md-4">
        <h2>员工考核</h2>
        <p>查看员工考核信息</p>
        <p><a class="btn btn-default" href="http://localhost:54250/EmployeeExamines">点此查看 &raquo;</a></p>
    </div>
    <div class="col-md-4">
        <h2>员工评价</h2>
        <p>查看员工评价信息</p>
        <p><a class="btn btn-default" href="http://localhost:54250/EmployeeEvaluations">点此查看 &raquo;</a></p>
    </div>
</div>
<p>当前时间：@ViewBag.CurrentTime</p>